<template>
  <Card shadow>
    <user-list ref="userList" v-on:refresh="refresh" v-if="!isRefresh"/>
  </Card>
</template>

<script>
import UserList from '_c/user-list/user-list'
import { on, off } from '@/libs/tools'
export default {
  name: 'user_mgmt',
  components: {
    'user-list': UserList
  },
  data () {
    return {
      firstEnter: false,
      isRefresh: false
    }
  },
  methods: {
    resizeSubComponents () {
      this.$children[0].$el.children[0].style.minHeight = this.$parent.$el.clientHeight - 36 + 'px'
      this.$refs.userList.table.height = this.$el.clientHeight - 235
    },
    refresh () {
      this.isRefresh = true
      this.$nextTick(() => {
        this.isRefresh = false
        this.$nextTick(() => {
          this.resizeSubComponents()
        })
      })
    }
  },
  created () {
    this.firstEnter = true
  },
  mounted () {
    this.$nextTick(() => {
      this.resizeSubComponents()
      on(window, 'resize', this.resizeSubComponents)
    })
  },
  activated () {
    if (!this.firstEnter) {
      this.resizeSubComponents()
      on(window, 'resize', this.resizeSubComponents)
    }
  },
  deactivated () {
    // document.querySelector('.content-wrapper.ivu-layout-content').style.overflowY = 'auto'
    off(window, 'resize', this.resizeSubComponents)
  },
  beforeDestroy () {
    // document.querySelector('.content-wrapper.ivu-layout-content').style.overflowY = 'auto'
    off(window, 'resize', this.resizeSubComponents)
  }
}
</script>
